// 引入 css
import './index.css'
// 引入 阿里矢量图标
import { createFromIconfontCN } from '@ant-design/icons';
// 引入路由方法
import { useNavigate } from 'react-router-dom';
// 引入 store
import store from 'store2';
import {FC} from 'react';
let IconFont = createFromIconfontCN({scriptUrl: '//at.alicdn.com/t/c/font_4148694_bdolvd6ba64.js'});

interface SettingProps{};

const Setting:FC<SettingProps>=()=>{

  // 返回上一个页面
  const navigate=useNavigate();
  const back=()=>{
    navigate(-1);
  }
  // 退出登录
  const logOut=()=>{
    store.remove('token');
    navigate('/login');
  }
    return(
        <div className='Setting'>
          <div className="settingHeader">
              <span onClick={back}><IconFont type='icon-31fanhui1'/></span>
              <h5>账号管理</h5>
              <span><IconFont type='icon-gengduo'/></span>
          </div>
          <div className='settingContent'>
            <li>
              <b>昵称：</b>
              <p>小须美鱥</p>
            </li>
            <li>
              <b>个性签名：</b>
              <p>随心所欲，蜂富多彩</p>
            </li>
            <span>修改密码</span>
            <div className="settingFooter">
              <button>保存</button>
              <button onClick={logOut}>退出登录</button>
            </div>
            
          </div>
        </div>
    )
}

export default Setting;